.top-nav-container{
  z-index: 999;
  height: 55px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 180px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  box-shadow: 0 5px 10px rgba(222, 222, 224, 0.5);
  .top-nav{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    p{
      cursor: pointer;
      padding: 3px 15px;
      margin: 0 5px;
    }
    .top-nav-item:hover{
      color: #409EFF;
    }
    .nav-active{
      color: #409EFF;
      border-radius: 3px;
      background-color: rgba(143, 130, 197, 0.5);
    }
  }
  
}
.member-box{
  width: 240px;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 0 10px #ccc;
  padding: 20px;
  text-align: center;
  ul{
    display: flex;
    justify-content: space-between;
    align-items: center;
    li{
      cursor: pointer;
      flex: 1;
      text-align: center;
      p,h3{
        font-weight: bold;
      }
    }
    li:hover{
      background-color: rgba(242, 241, 245, 0.473);
    }
  }
  ol{
    width: 100%;
    li{
      cursor: pointer;
      margin: 20px 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      span{
        margin-left: 10px;
      }
    }
    li:hover{
      background-color: rgba(242, 241, 245, 0.473);
    }
  }
}